<template>
    <div class="bottom">
        <AppDetailCard :hoverable="hoverable" class="item" v-for="(item,index) in apps" :app="item" :key="index" />
    </div>
</template>

<script>
import AppDetailCard from '@/components/AppDetailCard.vue'
export default {
    name: 'DoubleColumnAppCard',
    props: {
        apps: {
            type: Array,
            default: () => {
                return []
            }
        },
        hoverable: {
            type: Boolean,
            default: true
        }
    },
    components: {
        AppDetailCard
    }
}
</script>

<style lang="scss" scoped>
.bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: auto;
    margin: 4px 0 12px 0;
}
</style>